路由传参

query

通过 query 传参，如果我们想获取 id 的参数值，可以通过 this.$route.query.id 区别特点：参数是可见的，参数是直接在 url 后面添加的，用 query 传参可以解决页面刷新参数消失问题，query 更加类似于我们 ajax 中 get 传参

// 变成 /user?id=2
this.$router.push({
  path: '/user',
  query: {
    id: this.id
  }
})

params

通过 params 传递参数，如果我们想获取 id 的参数，可以通过 this.$route.params.id 区别特点：参数都是不可见的，当页面刷新了是获取不到参数值的，params 则类似于 ajax 中 post 传参

this.$router.push({
  path: '/user',
  params: {
    id: this.id
  }
})

hash（同 query）

通过 hash 传参，如果我们想获取 id 的参数值，可以通过 $route.hash.slice(1) 特点：参数是可见的，参数是直接在 url 后面添加的

// 变成/details/001#car
this.$router.push({
  path: '/user',
  query: {
    id: this.id
  }
})

const Details = {
  template: '<div>Details {{ $route.hash.slice(1) }} </div>'
}

参考文章

• https://segmentfault.com/a/1190000039398462